<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <link rel="stylesheet" href="styles/style.css">
        <link rel="stylesheet" href="styles/theme/atom-one-dark.css">
        <title>例子5-JS进阶（一）</title>
    </head>
    <body class="cols">
        <pre>
            <code>
                    // 例子5

                    function test() {
                        console.log(a);
                        console.log(foo());

                        var a = 1;

                        function foo() {
                            return 2;
                        }
                    }

                    test();
            </code>
        </pre>
        <pre>
            <code>
                    // 执行上下文变量对象创建和执行过程
                    // 创建阶段
                     testEC = {
                         VO: {
                             arguments: {...},
                             foo: < foo reference > , // 表示foo的地址引用
                             a: undefined
                         },
                         scopeChain: {...}
                     }

                    // 执行阶段 VO -> AO
                     testEC = {
                         AO: {
                             arguments: {...},
                             foo: < foo reference > ,
                             a: 1
                         },
                         scopeChain: {...}
                         this: window
                     }
            </code>
        </pre>
        <pre>
            <code>
                    // 变化顺序后
                    function test() {
                        function foo() {
                            return 2;
                        }

                        var a;
                        console.log(a);
                        console.log(foo());
                        a = 1;
                    }

                    test();
            </code>
        </pre>
        <script src="scripts/libs/highlight.pack.js"></script>
        <script src="scripts/5.js"></script>
        <script>
            hljs.initHighlightingOnLoad();
        </script>
    </body>
</html>